<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>材料采购</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
 

  <link rel="stylesheet" href="../../res/layuis/css/layui.css">
  <link rel="stylesheet" href="../../res/css/button/button.css">
  <link rel="stylesheet" href="../../res/css/row/row.css">
  <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
  <script type="text/javascript" src="../../res/layuis/layui.js" charset="utf-8"></script>
</head>
<body>
 <input type="hidden" id="purchaseText" style="height:50px;width: 900px;">
 <input type="hidden" id="rawstockIdText" style="height:50px;width: 900px;">
 <input type="hidden" id="sumNumberText">
 <input type="hidden" id="sumPriceText">
<div style="width: 15%;height: 526px;border: 1px solid #D3D3D3;box-shadow: 0 0 10px #C0C0C0;float: left;margin-right: 10px;margin-top: 10px;margin-left: 10px"" id="checkedDiv">
     
</div>
<div class="demoTable" style="margin-top: 10px;width: 75%;float: left;">
 
    <div class="x-body">
     <div class="layui-input-inline">
    <form class="layui-form" action="../../listenRawstock/findRawstock.action">
    
  
   <div class="layui-input-inline" style="width:224px;">
      <select name="rtId" lay-filter="aihao" id="rtId" lay-search >
       	<option value="">请选择材料类型</option>
      </select>
    </div>
      <div class="layui-input-inline">
          <input type="text" name="rawstockName" id="rawstockName" placeholder="请输入材料名称" autocomplete="off" class="layui-input" style="float: left;">
      </div>
      </form>
      </div>
       <div class="layui-input-inline">
         <button class="layui-btn" data-type="reload" lay-filter="sreach" id="materialSreach"><i class="layui-icon">&#xe615;</i></button>
      </div>
<table class="layui-table" lay-filter="demo" id="PurchaseTa">
  <!-- thead>
    <tr>
      <th lay-data="{field:'rawstockId', align:'center',type: 'space',style: 'display: none'}"></th>
      <th lay-data="{type:'checkbox', fixed: 'left'}"></th>
      <th lay-data="{field:'rawstockName', align:'center'}">材料名称</th>
      <th lay-data="{field:'rawstockPrice',align:'center'}">材料价格</th>
    </tr>
  </thead> -->
</table>
</div>
</div>
<div style="width: 100%;">
	<input type="hidden" id="purchaseId">
	<form class="layui-form">
		<div class="layui-row" >
		<div style="margin-top: 40px;">
	      <div class="layui-inline">
	         <label class="layui-form-label" style="margin-left: -20px;">采购总数量:</label>
	       <div class="layui-input-inline">
		    	<input type="text" name="sumNumber" style="width: 100px;" id="sumNumber" required  lay-verify="required" value="0" autocomplete="off" class="layui-input" disabled="disabled">
	      </div>
	      
	        
	    </div>
	    
	    <div class="layui-inline">
	      
	        <label class="layui-form-label" style="margin-left: -10px;">采购总金额:</label>
	       <div class="layui-input-inline">
		    	<input type="text" style="width: 100px;" name="sumPrice" id="sumPrice" required  lay-verify="required" value="0" autocomplete="off" class="layui-input" disabled="disabled">
	      </div>
	        
	    </div>
	    
	    <div class="layui-inline" style="margin-left: -25px;">
         <label class="layui-form-label">供应商:</label>
       <div class="layui-input-inline" style="width:200px;">
	    <select name="suId" lay-filter="aihao" id="suId" lay-search required lay-verify="required">
	       	<option value="">请选择供应商</option>
	      </select>
      </div>
      </div>
       <div class="layui-inline" style="margin-left: -25px;">
	      
	        <label class="layui-form-label">备注:</label>
	       <div class="layui-input-inline">
		    	<input type="text" name="explain" style="width:200px;" id="explain" required  lay-verify="required" maxLength="20" placeholder="备注" autocomplete="off" class="layui-input">
	      </div>
	        
	    </div>
       <div class="layui-input-inline" style="margin-left: 10px;">
         	<input type="button" class="layui-btn" lay-submit lay-filter="formEdit" value="提交采购订单">
      </div>
      </div>
	  </div>
	</form>
	<table class="layui-table" id="orderTa">
	   <thead>
	      <tr>
	      <th lay-data="{align:'center'}">材料名称</th>
	      <th lay-data="{align:'center'}">材料单价</th>
	      <th lay-data="{align:'center'}">材料数量</th>
	      <th lay-data="{align:'center'}">小计</th>
	    </tr>
	   </thead>
	   <tbody id="orderTb">
	   
	   </tbody>
	</table>
</div>

<script type="text/javascript">
layui.use('table',function(){
	  var table = layui.table;
	  var form = layui.form;
	  setTimeout(() => {
		  table.render({
			    elem: '#PurchaseTa'
			    	,page: true
			    ,url:'../../listenRawstock/findRawstock.action'
			    ,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
			    ,cols: [[
			    	{type:'checkbox',sort: true}
			      ,{field:'rawstockId', sort: true}
			      ,{field:'rawstockName',title: '材料名称', sort: true}
			      ,{field:'rawstockPrice',title: '材料价格'}
			    ]],id: 'idTest',done: function (res, curr, count) {
		            $("[data-field='rawstockId']").css('display','none');
		            $("#orderTb").html("")
		            $("#checkedDiv").html("")
		            if($("#sumNumberText").val()!="" && $("#sumPriceText").val()!=""){
		            	 
		             
		            	$("#sumNumber").val($("#sumNumberText").val())
						$("#sumPrice").val($("#sumPriceText").val())
		            }
		            
		            var purchaseTexts = new Array()
		            purchaseTexts=$("#purchaseText").val().split("#");
			       	 for (var i = 0; i < purchaseTexts.length-1; i++) {
			       		 
			       		 $("#orderTb").append("<tr>" +
			       					"<td>"+purchaseTexts[i].split(",")[1]+"</td>" +
			       					"<td>"+purchaseTexts[i].split(",")[2]+"</td>" +
			       					"<td><input type='text' name='title' id='number_"+purchaseTexts[i].split(",")[0]+"' required lay-verify='required' value='"+purchaseTexts[i].split(",")[3]+"' autocomplete='off' class='layui-input' style='border:0px;' onkeyup='input(this,event)'></td>" +
			       					"<td>  <input type='text' name='title' id='price_"+purchaseTexts[i].split(",")[0]+"'  value='"+purchaseTexts[i].split(",")[4]+"' autocomplete='off' class='layui-input' style='border:0px;' disabled='disabled'></td>" +
			       					"</tr>")
			       				form.render();
			        
			       		$("#checkedDiv").append("<div id='checkedDiv"+purchaseTexts[i].split(",")[0]+"' class='flag note note--success new-item' onclick='removeChecked(\"checkedDiv"+purchaseTexts[i].split(",")[0]+"\",\""+purchaseTexts[i].split(",")[0]+"\")'>"+
								"<div class='flag__image note__icon'><i class='fa fa-check'></i></div>"+
								" <div class='flag__body note__text'>"+purchaseTexts[i].split(",")[1]+"</div>"+
									"</div>")
			       		$('#PurchaseTa').next().find('.layui-table-body tr').each(function(index,item){
			       			
			       			var ids=$(item).find('td[data-field="rawstockId"]').text();
			       			if(purchaseTexts[i].split(",")[0]==ids){
			       				var index=$(item).data('index');
			       	            var che = $('#PurchaseTa').next().find('.layui-table-body tr[data-index="'+index+'"] input[name="layTableCheckbox"]')
			       	            che.prop("checked",true)
			       	           form.render();
			       			}
			       			
			       		});
			       	}
			       	 
			        
			    }
			  });
	}, 1000);
	 
});


</script>
 
 <script type="text/html" id="payNumber">
 <input type="text" name="title" id="number{{d.rawstockId}}" required lay-verify="required" value="0" autocomplete="off" class="layui-input" style="border:0px;" onkeyup="input(this,event)">
</script>
<script type="text/html" id="payPrice">
  <input type="text" name="title" id="price{{d.rawstockId}}"  value="0" autocomplete="off" class="layui-input" style="border:0px;" disabled="disabled">
</script>
 
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script type="text/javascript" src="../../res/js/PurchaseRawstock/PurchaseRawstock.js"></script>
</body>
</html>